<template>
    <div class="con">
        <header>
            <ul>
                <li @click="about()">
                    <img src="../assets/images/about.png" alt>
                    <p>关于我们</p>
                </li>
                <li @click="feedback()">
                    <img src="../assets/images/feedback.png" alt>
                    <p>意见反馈</p>
                </li>
                <li class="phone">
                    <a href="tel:02566046356"></a>
                    <img src="../assets/images/phone.png" alt>
                    <p>客服电话</p>
                </li>
            </ul>
        </header>
        <div class="main">
            <div class="list" @click="credit()">
                <p>信用卡收款</p>
                <img src="../assets/images/more.png" alt>
            </div>
            <div class="list" @click="tradesafe()">
                <p>交易安全</p>
                <img src="../assets/images/more.png" alt>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    name: "help",

    methods: {
        about() {
            this.$router.push({ name: "about" });
        },
        feedback() {
            this.$router.push({ name: "feedback" });
        },
        credit() {
            this.$router.push({ name: "creditcollection" });
        },
        tradesafe() {
            this.$router.push({ name: "tradesafeytb" });
        }
    }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.con {
    width: 100%;
    min-height: 100vh;
    background: #f9f9f9;
}
header {
    width: 100%;
    height: 109px;
    background: #fff;
}
ul {
    width: 100%;
    height: 109px;
}
ul li {
    width: 33.3%;
    height: 109px;
    float: left;
    text-align: center;
}
ul li img {
    width: 46px;
    height: 46px;
    margin-top: 16px;
}
ul li p {
    font-size: 14px;
    color: #2d3659;
    margin-top: 9px;
    font-weight: 600;
}
ul .phone {
    position: relative;
}
ul .phone a {
    width: 100%;
    height: 109px;
    position: absolute;
    z-index: 999;
    top: 0;
    left: 0;
}
.main {
    margin-top: 12px;
    width: 100%;
    background: #fff;
}
.main .list {
    height: 62px;
    width: 94%;
    margin-left: 3%;
    position: relative;
}
.main .list:first-child {
    border-bottom: 1px solid #f9f9f9;
}
.main .list img {
    width: 6px;
    height: 10px;
    position: absolute;
    right: 2px;
    top: 26px;
}
.main .list p {
    line-height: 62px;
    color: #2d3659;
    font-weight: 600;
    text-indent: 10px;
}
</style>
